<template>
	<view style="background-color: #F6F6F6;">
		<u-navbar title="客户档案详情"></u-navbar>
		<!-- header -->
		<!-- <view class="bg"></view> -->
		<view style="margin-top: 20rpx;">
			
			<!-- card 用户信息-->
			<view class="card">
				<view class="flex flex-ai-c" style="padding-top: 21rpx;border-bottom: 2rpx solid #EEEEEE;padding-bottom: 21rpx;">
					<view class="line"></view>
					<view>基本信息</view>
				</view>
				<view class="flex card-title" style="flex: 1;">
					<view class="flex flex-ai-c" style="flex: 1;">
						<view style="width: 35%;">姓名</view>
						<view>{{list.uname}}</view>
						<view class="flex flex-jc-fe" style="width: 35%;">
							<view class="new flex flex-ai-c flex-jc-c" v-if="list.newCustomers">新客</view>
							<view class="old flex flex-ai-c flex-jc-c" v-else>老客</view>
						</view>
					</view>
				</view>
				<view class="flex flex-ai-c card-title">
					<view style="width: 35%;">联系电话：</view>
					<view class="flex flex-ai-c right">
						<view>{{list.mobile}}</view>
						<!-- <view><i-icon icon="iconlianxi" color="#FDD421" size="30rpx"></i-icon></view> -->
					</view>
				</view>
				<view class="flex flex-ai-c card-title">
					<view style="width: 35%;">身份证号码：</view>
					<view class="right">{{list.idcardno}}</view>

					<!-- <view>{{ returnTime(list.addtime) }}</view> -->

				</view>
				<view class="flex flex-ai-c card-title" style="border: 0;">
					<view style="width: 35%;">初登日期：</view>
					<view class="right">{{returnTime(carList.addTime)}}</view>
				</view>
			</view>
			
			<!-- 车源信息 -->
			<view class="card" style="margin-top: 20rpx;">
				<view class="flex flex-ai-c" style="padding-top: 21rpx;border-bottom: 2rpx solid #EEEEEE;padding-bottom: 21rpx;">
					<view class="line"></view>
					<view>车源信息</view>
				</view>
				<view class="flex flex-ai-c card-title">
					<view class="flex" style="margin-right: 10rpx;">
						<image style="width:50rpx;height: 50rpx;" :src="'https://files.yzsheng.com/goodimg/brandimg/' + carList.brand_id + '.png'"></image>
					</view>
					<view class="right">{{carList.brand_name}}{{carList.car_name}}</view>
				</view>
				<view class="flex flex-ai-c card-title">
					<view style="width: 35%;">车牌号：</view>
					<view class="right">{{carList.car_num}}</view>
				</view>
				<view class="flex flex-ai-c card-title">
					<view style="width: 35%;">VIN：</view>
					<view class="right">{{carList.vin}}</view>
				</view>
				<view class="flex flex-ai-c card-title">
					<view style="width: 35%;">行驶公里数：</view>
					<view class="right">{{carList.mileage}}km</view>
				</view>
				<view class="flex flex-ai-c card-title">
					<view style="width: 35%;">保险到期日：</view>
					<view class="right">{{returnTime(carList.duetotime)}}</view>
				</view>

				<!-- 处理项 -->
				<view class="flex flex-jc-sb flex-ai-c card-title" style="border: 0;">
					<!-- 紧急处理 -->
					<view class="flex flex-ai-c">
						<view class="chuli">
							<view class="chuli1"></view>
							<view class="chuli-yuan"></view>
						</view>
						<view>{{carList.emergency}}项紧急处理</view>
					</view>
					<!-- 建议处理 -->
					<view class="flex flex-ai-c">
						<view class="chuli">
							<view class="chuli1" style="background: #FBD220;"></view>
							<view class="chuli-yuan" style="background: #FBD220;"></view>
						</view>
						<view>{{carList.advice}}项建议处理</view>
					</view>
					<view></view>
					<!-- <view class="look" @click="goPage()">查看详情<u-icon name="arrow-right" color="#999999"></u-icon> -->
					</view>
				</view>
			</view>

			<!-- 金额 消费历史-->
			
			<view class="card" style="margin-top: 20rpx; margin-bottom: 0rpx;padding-bottom: 21rpx;">
				<view class="flex flex-ai-c" style="padding-top: 21rpx;border-bottom: 2rpx solid #EEEEEE;padding-bottom: 21rpx;">
					<view class="line"></view>
					<view>消费历史</view>
				</view>
				<view class="flex flex-jc-sa total">
					<view>
						<view class="price">{{list.consumptionCount}}</view>
						<view>消费次数</view>
					</view>
					<view>
						<view class="price">{{list.totalAmount}}</view>
						<view>消费总金额</view>
					</view>
				</view>
				<view>
					<u-table border-color="#EEEEEE">
						<u-tr class="u-tr">
							<u-th class="u-th">日期</u-th>
							<u-th class="u-th">服务内容</u-th>
							<u-th class="u-th">费用</u-th>
						</u-tr>
						<u-tr class="u-tr" v-for="(item,index) in showList" :key='index'>
							<u-td class="u-td">{{returnTime(item.accomplish_time)}}</u-td>
							<u-td class="u-td">{{item.order_type}}</u-td>
							<u-td class="u-td">{{item.total_money}}元</u-td>
						</u-tr>
					</u-table>
					 <view @click="isMore = !isMore">
						<view style="margin: 0 auto;text-align: center;line-height: 70rpx;background-color: #EEEEEE;">{{title}}</view>
					</view>
				</view>
				<!-- <view>
					<view class="flex flex-jc-sa">
						<view class="dip">日期</view>
						<view class="dip">服务内容</view>
						<view class="dip">费用（元）</view>
					</view>
					<view class="flex" v-for="(item,index) in 3" :key='index' style="margin-top: 10rpx;">
						<view class="dip bgs">2020-08-29</view>
						<view class="dip bgs">洗车</view>
						<view class="dip bgs">39</view>
					</view>
				</view> -->
			</view>
			
			<!-- 回访记录 -->
			<view style="padding-bottom: 100rpx;">
				<view class="card" style="margin-top: 20rpx;" v-if="false">
					<view class="flex flex-ai-c" style="padding: 21rpx 0;">
						<view class="line"></view>
						<view>回访记录</view>
					</view>

					<!-- 回访时间 -->
					<view v-for="(item2,i) in 3" :key='i' style="border-top: 2rpx solid #EEEEEE;line-height: 60rpx;color: #999999;">
						<view class="flex">
							<view style="width: 25%;">回访时间：</view>
							<view class="return-visit">2020-09-12 12：59</view>
						</view>
						<view class="flex">
							<view style="width: 25%;">回访人：</view>
							<view class="return-visit">其他门店</view>
						</view>
						<view class="flex">
							<view style="width: 25%;">回访状态：</view>
							<view class="return-visit">回访成功</view>
						</view>
						<view class="flex">
							<view style="width: 25%;">回访备注：</view>
							<view class="return-visit">其他门店数据</view>
						</view>
					</view>
				</view>
			</view>

		</view>

	</view>
</template>

<script src='./archivesDetails.js'>
</script>

<style lang="scss">
	@import './archivesDetails.scss';
</style>
